﻿

<html>
<head>
<title>CSS3 Border Left Test</title>

<style type="text/css">
h3 {border-left: aqua solid 50px;}
h4 {border-left: 5px silver dashed;}
em {border-left: 5px dotted green;}
blockquote {border-left: 200%;}
</style>
</head>

<body>




<h1>CSS3 Border Left Test</h1>





<ul>
<li >
For "border-left", initial is (see individual properties), it applies to all elements,
it is not inherited, percentage values are N/A, media is visual, and computed value is
absolute values.
</li>
</ul>
<h2>
PASS CRITERIA:
</h2>
<p>
If statement above is correct, this paragraph should have the 
border left determined by initial indivdual property values.  No specific CSS rules are applied.  However, the
border left property does apply to the p element.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
</p>
<h3>
This h3 heading has a border left of aqua solid 50px, but this <em>emphasized text
</em> has a border left of 5em dotted green; the rules applied are:
"h3 {border-left: aqua solid 50px;}"
"em {border-left: 5em dotted green;}"
So the border left property applies to the h3 and em elements.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
</h3>
<h4>
This h4 heading has a border left property of 5mm silver dashed (because of the
rule "h4 {border-left: 5mm silver dashed;}", but these <i>italicized words</i>
have a border left of (initial values of individual properties), because the border-left
property does not inherit.  
So the border left property does apply to the h4 and i elements.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
</h4>
<blockquote>
This blockquote element should have a UA-default border left.  The
nonsensical rule "blockquote {border-left: 200%}" should be ignored,
but the border-left property does apply to the blockquote element.  No other CSS rules
are applied bo blockquote.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
Here is more text to test this more effectively.
</blockquote>
<p>
All other properties of this page should be UA-default.
This is a paragraph, like the one above.  
</p>

</body>
</html>
